var mySwiper = new Swiper('.swiper', {
    direction: 'horizontal', // 垂直切换选项
    loop: true, // 循环模式选项
    effect: 'fade', // 设置Slide的切换效果，淡入
    fadeEffect: {
        crossFade: true,
    },

    autoplay: {
        delay: 3000,
        stopOnLastSlide: false,
        disableOnInteraction: false,
    }
});




let loginBox = document.querySelector('.loginBox');

let mail_phone_loginBox = document.querySelector('.mail_phone-loginBox');

let resetBox = document.querySelector('.resetBox');



let dialogBox = document.querySelector('.dialogBox');

let dialog = document.querySelector('.dialog');

let text_iconfont = document.querySelector('.text_iconfont');

let dialog_phone = document.querySelector('.dialog_phone');


mail_phone_loginBox.onclick = function (e) {

    e = event || window.event;

    // 点击 ‘找回密码’，跳转到 重置页面
    if (e.target.classList.contains('findpsd-btn')) {

        // 元素.style.属性 = "属性值"，设置内联样式

        mail_phone_loginBox.style.display = "none";

        resetBox.style.display = "flex";
    };

    // 点击 ‘点击注册’，跳转到注册页面
    if (e.target.classList.contains('dialog-btn')) {

        loginBox.style.display = "none";

        dialogBox.style.display = 'block'
    }
};

resetBox.onclick = function (e) {

    e = event || window.event;

    if (e.target.classList.contains('findpsd-btn')) {

        mail_phone_loginBox.style.display = "flex";

        resetBox.style.display = "none";
    };

    if (e.target.classList.contains('dialog-btn')) {

        loginBox.style.display = "none";

        dialogBox.style.display = 'block'
    }
};


dialogBox.onclick = function (e) {

    e = event || window.event;

    if (e.target.classList.contains('go_to_phoneDialog')) {

        text_iconfont.style.display = 'none';

        dialog_phone.style.display = 'block';
    };

    if (e.target.classList.contains('goback-oauth')) {

        text_iconfont.style.display = 'flex';

        dialog_phone.style.display = 'none';
    };

    if (e.target.classList.contains('go_to_login')) {

        dialogBox.style.display = 'none';

        text_iconfont.style.display = 'flex';

        dialog_phone.style.display = 'none';

        loginBox.style.display = "flex";

        mail_phone_loginBox.style.display = "flex";

        resetBox.style.display = "none";
    };
};


jQuery.validator.addMethod('testUsername', function (value) {

    let usernameReg = /^((1[3-9]\d{9})|(\w+((.\w+)|(-\w+))@[A-Za-z0-9]+((.|-)[A-Za-z0-9]+).[A-Za-z0-9]+))$/i;

    return usernameReg.test(value);

});

jQuery.validator.addMethod('testPassword', function (value) {

    // 至少8个字符，至少一个字母和至少一个数字

    let passwordReg = /^(?=.*[A-Za-z])(?=.*\d)[A-Za-z\d]{8,}$/i;

    return passwordReg.test(value);

});

jQuery.validator.addMethod('testPhone', function (value) {

    // 至少8个字符，至少一个字母和至少一个数字

    let phoneReg = /^1[3-9]\d{9}$/i;

    return phoneReg.test(value);

});

$('#loginPage').validate({

    rules: {

        username: {
            required: true,
            testUsername: true
        },
        password: {
            required: true,
            testPassword: true
        }
    },

    messages: {
        username: {
            required: '',
            testUsername: '请输入正确的手机号码/邮箱'
        },
        password: {
            required: '密码是必填的',
            testPassword: '密码至少8个字符，至少一个字母，至少一个数字'
        }
    },

    // 已经做了取消自动刷新功能
    submitHandler: function () {

        let goto_login_btn = document.querySelector('.goto-login-btn');

        let un = document.querySelector('.username').value;
        let psd = document.querySelector('.password').value;

        goto_login_btn.onclick = function () {

            /* 
                - 注意点：indexOf的返回值只有两种情况： 
                    1.如果不存在，则返回-1；
                    2.如果存在，则返回该 字符串 的索引值
                
                - 所以判断的时候，要根据返回值是否是-1来判断！
            */


            let xhr = new XMLHttpRequest();

            if (un.indexOf('@') != -1) {

                xhr.open('get', `http://localhost:8080/login?email=${un}&password=${psd}`);
            }
            if (un.indexOf('@') == -1) {

                xhr.open('get', `http://localhost:8080/login?tel=${un}&password=${psd}`);
            }

            xhr.send();

            xhr.onload = function () {

                let res = JSON.parse(xhr.responseText)

                // console.log(res);

                if (res.code == true) {
                    setCookie('user',un,5);
                    alert(res.msg);
                    location.href = '../html/index.html'
                    return;
                };
                alert(res.msg);
            }
        }

    }
});

$('#dialogPage').validate({

    rules: {

        dialogPhone: {
            required: true,
            testPhone: true
        }
    },

    messages: {
        dialogPhone: {
            required: '',
            testPhone: '请输入正确的手机号码'
        }
    },

    // 已经做了取消自动刷新功能
    submitHandler: function () {

        let goto_dialog = document.querySelector('.goto-dialog');

        let telphone = document.querySelector('.dialogPhone').value;

        goto_dialog.onclick = function () {

            /* 
                - 注意点：indexOf的返回值只有两种情况： 
                    1.如果不存在，则返回-1；
                    2.如果存在，则返回该 字符串 的索引值
                
                - 所以判断的时候，要根据返回值是否是-1来判断！
            */


            let xhr = new XMLHttpRequest();

            xhr.open('get', `http://localhost:8080/whetherdialog?tel=${telphone}`);

            xhr.send();

            xhr.onload = function () {

                let res = JSON.parse(xhr.responseText);

                if (res.code != true) {
                    alert(res.msg);
                    return;
                };

                location.href = `../html/completeInfo.html?tel=${telphone}`;

            }
        }

    }
});